/**
 *@auther: tang
 @Date: 2020-11-12
 *Project: group-booking-shop-manage-system
 */
import React from "react"
import {Button, Form, Input, Row,Col,message,Modal} from 'antd';
import Req from "../../../api"

class AddAdmin extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            tabHNode :{}

        }
        this.admForm = React.createRef();
    }

    onFinish(data){
        console.log(data);
        Req.addAdmin({
            username:data.newUserName,
            password:data.newUserPwd,
            repassword:data.confirmPwd
        }).then(res=>{
            console.log(res);
            message.success(`添加成功,已添加名为${data.newUserName}的管理员`);
              this.gotoTabHome();
            //重置表单
            this.admForm.current.resetFields();
            // console.log(this.state.tabHNode)
        }).catch(err=>{
            console.log(err)
        })

    }
    gotoTabHome = ()=>{
    //    跳转到管理员列表
        this.state.tabHNode.click();
    }
    componentWillMount() {
        this.setState({
            tabHNode:this.props.tabHomeNode.current
        })

    }

    render() {
        return (
            <div>
                <Form
                    ref={this.admForm}
                    name="basic"
                    initialValues={{
                        remember: true,
                    }}
                    onFinish={this.onFinish.bind(this)}
                    hideRequiredMark
                    labelCol={{
                        span:4
                    }}
                    wrapperCol={{
                        span:10
                    }}
                >
                    <Form.Item
                        label="用户名"
                        name="newUserName"
                        rules={[
                            {
                                required: true,
                                message: '请输入用户名',
                            },
                        ]}
                    >
                        <Input type="text"/>
                    </Form.Item>

                    <Form.Item
                        label="密码"
                        name="newUserPwd"
                        rules={[
                            {
                                required: true,
                                message: '请输入密码'
                            },
                        ]}
                    >
                        <Input.Password />
                    </Form.Item>
                    <Form.Item
                        label="确认密码"
                        name="confirmPwd"
                        dependencies={['newUserPwd']}
                        hasFeedback
                        rules={[
                            {
                                required: true,
                                message: '请输入确认密码',
                            },
                            ({ getFieldValue }) => ({
                                validator(rule, value) {
                                    if (!value || getFieldValue('newUserPwd') === value) {
                                        return Promise.resolve();
                                    }
                                    return Promise.reject('输入的密码和确认密码不一致');
                                },
                            }),
                        ]}
                    >
                        <Input.Password />
                    </Form.Item>

                    <Form.Item>
                        <Row>
                            <Col span={6}></Col>
                            <Col span={8}>
                                <Button type="primary" htmlType="submit">
                                    提交
                                </Button>
                            </Col>

                        </Row>

                    </Form.Item>
                </Form>

            </div>
        )
    }
}

export {AddAdmin as default}
